import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { DNavBar, DImagesupload } from '@/components'
import { AtForm, AtInput, AtButton } from 'taro-ui'
import http from '@/api'
import './carregister.scss'
export default class CarregisterBox extends Component {

    constructor(props) {
        super(props)
        this.state = {
            carname: '',
            carnum: '',
            carage: '',
            status: '1',
            dirvername: '',
            carregister: [],
            carlicense: [],
            carinsure: [],
            _status: false,
            dirverlicense: {},
            _obj: {
                carregister: '',
                carlicense: '',
                carinsure: '',
                dirverlicense: ''
            },
            isShow: true
        }
    }


    componentWillMount() {
        let { status = '1', id = '' } = this.$router.params
        if (id) {
            this.setState({
                isShow: false
            })
            this.myCarDetail()
        }
        this.setState({
            status
        })
    }
    myCarDetail() {
        let { id } = this.$router.params
        let { carname,
            carnum,
            carage,
            dirvername,
            carregister,
            carLicenseList,
            dirverlicense,
            _status } = this.state
        let src1 = [], src2 = [], src3 = [], src4 = []
        http.myCarDetail({ id: `${id}` }).then(res => {
            console.log(res)
            this.setState({
                carname: res.ciName,
                carnum: res.ciNo,
                carage: res.ciAge,
                dirvername: res.drName
            })
            res.transCarInfoFileList.map(item => {
                if (item.cfFileType === '1') {
                    src1.push({
                        id: item.cfFileId,
                        url: item.cfFileUrl
                    })
                }
                if (item.cfFileType === '2') {
                    src2.push({
                        id: item.cfFileId,
                        url: item.cfFileUrl
                    })
                }
                if (item.cfFileType === '3') {
                    src3.push({
                        id: item.cfFileId,
                        url: item.cfFileUrl
                    })
                }
            })
            res.transDriverFileList.map(item => {
                src4.push({
                    id: item.cfFileId,
                    url: item.cfFileUrl
                })
            })
            this.bindCarform('carregister', src1)
            this.bindCarform('carlicense', src2)
            this.bindCarform('carinsure', src3)
            this.bindCarform('dirverlicense', src4)
            this.setState({
                item: res,
                src1,
                src2,
                src3,
                src4,
                isShow: true
            })
        })
    }
    handleSubmit() {
        this.saveCarRigister()
    }

    saveCarRigister() {

        let { carname,
            carnum,
            carage,
            dirvername,
            carregister,
            carlicense,
            carinsure,
            carLicenseList,
            dirverlicense,
            _status } = this.state
        let objArr = [carname, carnum, carage, dirvername]
        let _objArr = ['carname', 'carnum', 'carage', 'dirvername']
        let _item = ''
        // objArr.map(item => {
        //     if (!item) {
        //         _status = true
        //     }
        // })
        for (let i = 0, j = objArr.length; i < j; i++) {
            if (!(objArr[i])) {
                _status = true
                _item = _objArr[i]
                break
            }
        }
        let objtext = {
            carname: '请输入运输车辆名称',
            carnum: '请输入运输车辆号码',
            carage: '请输入车辆年龄',
            dirvername: '请输入司机姓名'
        }
        if (_status) {
            return this.tipShowTaost(objtext[_item])
        }
        console.log('输出数', carregister, carlicense, carinsure, dirverlicense)

        if (carregister.length === 0) {
            return this.tipShowTaost('请上传车辆照片！')
        } else if (carlicense.length === 0) {
            return this.tipShowTaost('请上传车辆行驶证！')
        } else if (carinsure.length === 0) {
            return this.tipShowTaost('请上传车辆保险证！')
        } else if (!dirverlicense.fileId) {
            return this.tipShowTaost('请上传司机驾驶证！')
        }

        let obj = {
            ciAge: `${carage}`,
            ciName: `${carname}`,
            ciNo: `${carnum}`,
            drName: `${dirvername}`,
            carLicenseList: [...carlicense, ...carinsure],
            carPhotoList: carregister,
            drivingLicence: dirverlicense
        }
        http.saveCarRigister(obj).then(res => {
            Taro.showToast({
                title: '已运输车辆登记成功！',
                duration: 800,
                mask: true
            }).then(() => {
                setTimeout(() => {
                    Taro.redirectTo({
                        url: `/pages/transportmgr/transportmgr?active=1`
                    })
                    // Taro.navigateTo({
                    //     url: `/pages/transportmgr/transportmgr?active=1`
                    // })
                }, 1000);
            })
        })
    }
    tipShowTaost(title) {
        return Taro.showToast({
            title,
            icon: 'none'
        })
    }
    changeCarname(carname) {
        this.setState({
            carname
        })
    }
    changeCarnum(carnum) {
        this.setState({
            carnum
        })
    }
    changeCarage(carage) {
        this.setState({
            carage
        })
    }
    changeDirvername(dirvername) {
        this.setState({
            dirvername
        })
    }
    bindCarform(key, value) {
        let { carregister, carlicense, carinsure, dirverlicense } = this.state
        if (key === 'carregister') {
            carregister = []
            if (value.length !== 0) {
                value.map(item => {
                    carregister.push(
                        {
                            fileId: `${item.id}`,
                            fileName: '',
                            fileType: 1,
                            fileUrl: `${item.url}`
                        }
                    )
                })
            }
            this.setState({
                carregister
            })
        } else if (key === 'carlicense') {
            // carlicense = value
            carlicense = []
            if (value.length !== 0) {
                value.map(item => {
                    carlicense.push(
                        {
                            fileId: `${item.id}`,
                            fileName: '',
                            fileType: 2,
                            fileUrl: `${item.url}`
                        }
                    )
                })
            }
            this.setState({
                carlicense
            })
        } else if (key === 'carinsure') {
            // carinsure = value
            carinsure = []
            if (value.length !== 0) {
                value.map(item => {
                    carinsure.push(
                        {
                            fileId: `${item.id}`,
                            fileName: '',
                            fileType: 3,
                            fileUrl: `${item.url}`
                        }
                    )
                })
            }
            this.setState({
                carinsure
            })
        } else if (key === 'dirverlicense') {
            // dirverlicense = value[0]
            dirverlicense = {}
            if (value.length !== 0) {
                dirverlicense = {
                    fileId: `${value[0].id}`,
                    fileName: '',
                    fileType: 1,
                    fileUrl: `${value[0].url}`
                }
            }
            this.setState({
                dirverlicense
            })
        }

    }

    onLookImages(status = '') {
        Taro.navigateTo({
            url: `/pages/itemImages/itemImages?status=${status}`
        })
    }

    render() {
        const {
            carname,
            carnum,
            carage,
            dirvername,
            _obj,
            status,
            src1,
            src2,
            src3,
            src4,
            isShow
        } = this.state
        const _imageList = function (key, value) {
            this.bindCarform(key, value)
        }
        return (
            <View className='b_carregister'>
                <DNavBar title={'运输车辆登记'}></DNavBar>
                <View className='b_carregister__box'>
                    <View className='b_carregister__form'>
                        <AtForm>
                            <View className='b_carregister__form__item'>
                                <AtInput
                                    value={carname}
                                    title='车辆名称'
                                    onChange={this.changeCarname.bind(this)}
                                    placeholder='请输入运输车辆名称'
                                ></AtInput>
                                <AtInput
                                    value={carnum}
                                    onChange={this.changeCarnum.bind(this)}
                                    title='车牌号码'
                                    placeholder='请输入运输车辆号码'
                                ></AtInput>
                                <AtInput
                                    value={carage}
                                    onChange={this.changeCarage.bind(this)}
                                    title='车辆年龄'
                                    placeholder='请输入车辆年龄'
                                ></AtInput>
                                <AtInput
                                    value={dirvername}
                                    onChange={this.changeDirvername.bind(this)}
                                    title='司机姓名'
                                    placeholder='请输入司机姓名'
                                ></AtInput>
                            </View>
                            {isShow &&
                                <View className='b_carregister__form__item'>

                                    <View className='b_carregister__images'>
                                        <Text className="b_carregister__images_title">车辆照片(最多可上传四张)</Text>
                                        <DImagesupload value={src1} bind='carregister' count={4} text={'查看'} onChangeImages={_imageList.bind(this, 'carregister')}></DImagesupload>
                                    </View>
                                    <View className='b_carregister__images'>
                                        <Text className="b_carregister__images_tips" onClick={this.onLookImages.bind(this, 'carrunrecord')}>查看范例</Text>
                                        <Text className="b_carregister__images_title">车辆行驶证</Text>
                                        <DImagesupload value={src2} bind='carlicense' onChangeImages={_imageList.bind(this, 'carlicense')}></DImagesupload>
                                    </View>
                                    <View className='b_carregister__images'>
                                        <Text className="b_carregister__images_tips" onClick={this.onLookImages.bind(this, 'carinsure')}>查看范例</Text>
                                        <Text className="b_carregister__images_title">车辆保险证</Text>
                                        <DImagesupload value={src3} bind='carinsure' onChangeImages={_imageList.bind(this, 'carinsure')}></DImagesupload>
                                    </View>
                                    <View className='b_carregister__images'>
                                        <Text className="b_carregister__images_tips" onClick={this.onLookImages.bind(this, 'carrun')}>查看范例</Text>
                                        <Text className="b_carregister__images_title">司机驾驶证</Text>
                                        <DImagesupload count={1} value={src4} bind='dirverlicense' onChangeImages={_imageList.bind(this, 'dirverlicense')}></DImagesupload>
                                    </View>
                                </View>}
                        </AtForm>
                    </View>
                    <View className='b_carregister__footer'>
                        {status === '1' && <AtButton className='item_btn' onClick={this.handleSubmit.bind(this)}>提交登记</AtButton>}
                        {status !== '1' && <AtButton className='item_btn' onClick={this.handleSubmit.bind(this)}>重新登记</AtButton>}
                    </View>
                </View>
            </View>
        )
    }
}